<template>
  <a-row>
    <a-table ref="table" size="middle" bordered row-key="index" :columns="columns" :data-source="dataSource"
      :pagination="ipagination" :loading="loading" class="j-table-force-nowrap" @change="handleTableChange">
      <template slot="fileName" slot-scope="text, record, index">
        <j-ellipsis :value="text" :length="20" />
      </template>
      <template slot="action" slot-scope="text, record">
        <a-button title="预览" @click="OnPerview(record)">预览</a-button>
        <a-button style="margin-left: 5px" title="下载" @click="OnDownLoad(record)">下载</a-button>
      </template>
    </a-table>
  </a-row>
</template>

<script>

import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import columns from './columns'
import { Base64 } from 'js-base64'

export default {
  name: 'PerviewForm',
  components: {
  },
  mixins: [JeecgListMixin],
  props: {
    // 表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      columns: columns(),
      confirmLoading: false,
      disableMixinCreated: true,
      queryParam: {},
      url: {
        list: '/sjtb/dataCollectionTemplateVersion/versionList'
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  created() {
  },
  methods: {
    OnDownLoad(record) {
      this.$message.success('正在下载，请稍等！')
      const url = `${window._CONFIG['domianURL']}/sys/common/static/${record.path}`
      window.open(url, '_blank')
    },
    OnPerview(record) {
      const fileUrl = `${window._CONFIG['onlinePreviewFileURL']}/sys/common/static${record.path}`
      const url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(Base64.encode(fileUrl))}`
      window.open(url, '_blank')
    },
    edit(record) {
      this.queryParam = { id: record.versionId, templateId: record.id }
      this.loadData(1)
      this.visible = true
    }
  }
}
</script>
<style scoped>
.title {
  width: 20%;
  font-weight: bold;
  font-size: 15px;
  margin-bottom: 15px;
  color: #3955a5;
}
</style>
